﻿
@{
    ViewData["Title"] = "Index";
    Layout = "~/Views/Shared/MyMasterPage.cshtml";
}

<!-- content-area -->
<div id="news">
    <div class="light-section section-block">
        <div class="container">
            <div class="section-space"></div>
            <div class="row">

                <div class="col-lg-6" v-for="item in dataList">
                    <article class="post-entry">
                        <div class="post-image">
                            <a :href="url+item.Id">
                                <img width="600" height="430" :src="item.ThumbImage">
                                <span class="filter-grayscale"></span>
                            </a>
                        </div>
                        <div class="post-content">
                            <h4 class="post-title"><a href="#">{{item.NewsTitle}}</a></h4>
                            <ul class="post-tags">
                                <li>{{item.BaseModifyTime}}</li>
                               
                            </ul>
                            <div class="description">
                                <p>
                                    {{item.NewsTag}}
                                </p>
                            </div>
                        </div>
                    </article>
                </div>

            </div>
            <div class="row">
                <div class="col-lg-12">
                    <div class="pagination">
                        <ul>
                            <li v-if="pageIndex>1"><a v-on:click="pageIndex--,pageClick()">上一页</a></li>
                            <li v-if="pageIndex==1"><a class="banclick">上一页</a></li>
                            <li v-for="index in indexPage" v-bind:class="{ 'active': pageIndex == index}">
                                <a v-on:click="btnClick(index)">{{index}}</a>
                            </li>

                            <li v-if="pageIndex!=all"><a v-on:click="pageIndex++,pageClick()">下一页</a></li>
                            <li v-if="pageIndex == all"><a class="banclick">下一页</a></li>
                        </ul>
                    </div>
                    <!--分页-->

                </div>
            </div>
            <div class="section-space"></div>
        </div>
    </div>

</div>

<script type="text/javascript">
    var vm = new Vue({
        el: "#news",
        data: {
            url: '/News/NewsDetail?id=',
            dataList: [],
            NewsType: '', //类型
            all: 0,//总页数
            pageIndex: 1, //当前页
            pageSize: 6, //每页条数
            name: '好',
            indexPage: []

        },
        mounted() {
            this.getReq();//渲染之前
            this.getList(1);//获取数据

        },

        methods: {
            //获取News内容
            getList(pageIndex) {
                var that = this
                $.ajax({
                    type: 'GET',
                    url: '/api/News/GetPageListJson?pageSize=' + this.pageSize + '&pageIndex=' + pageIndex + '&NewsType=' + this.NewsType,
                    data: {},
                    success: function (res) {
                        that.dataList = res.Result,
                            that.all = res.TotalCount,
                            that.name = '不好'
                        vm.$forceUpdate();
                        console.log(that.dataList)
                        console.log(that.name)
                        that.indexs();//分页
                    }
                });
            },
            //获取url参数
            getReq() {
                var Requset = new Object;
                Requset = GetRequest();
                this.NewsType = Requset["NewsType"]
                this.pageIndex = Requset["pageIndex"]

                if (this.NewsType == undefined) {
                    this.NewsType = ''
                }
                if (this.pageIndex == undefined) {
                    this.pageIndex = 1
                }
                console.log(this.NewsType)
            },
            //分页
            indexs() {
                var left = 1;
                var indexall = parseInt(this.all / this.pageSize);

                var arr = [];
                if (indexall == 0) {
                    arr.push(1);
                } else {
                    for (let i = 1; i <= indexall; i++) {
                        arr.push(i);

                    }
                }
                this.indexPage = arr;
                console.log(arr)

            },
            //分页
            btnClick: function (data) {//页码点击事件
                if (data != this.pageIndex) {
                    this.pageIndex = data
                }
                //根据点击页数请求数据
                this.getList(this.pageIndex);
            },
            pageClick: function () {
                //根据点击页数请求数据
                this.getList(this.pageIndex);
            }

        },
        created() {

        },
    })
</script>

